JavaScript Loyihalash Andozalari: Singleton, Observer va Factory Implementatsiyalari

Loyihalash andozalari — bu dasturiy ta'minotni loyihalashda tez-tez uchraydigan muammolarning qayta ishlatiladigan yechimlari. Ular vaqt o'tishi bilan o'rganilgan eng yaxshi amaliyotlarni ifodalaydi va JavaScript ilovalaringizning tuzilishini, qo'llab-quvvatlanuvchanligini va kengaytiriluvchanligini sezilarli darajada yaxshilashi mumkin. Ushbu maqolada uchta asosiy loyihalash andozasi: Singleton, Observer va Factory ko'rib chiqiladi va ularning amaliy qo'llanilishi va real hayotdagi misollari keltiriladi.

Loyihalash Andozalarini Tushunish

Muayyan andozalarga sho'ng'ishdan oldin, ularning nima uchun qimmatli ekanligini tushunish muhim. Ular bir nechta afzalliklarni taklif etadi:

• Qayta foydalanish imkoniyati: Loyihalash andozalari — bu turli xil muammolarga qo'llanilishi mumkin bo'lgan sinovdan o'tgan yechimlar.
• Qo'llab-quvvatlanuvchanlik: Belgilangan andozalarga rioya qilish yanada tartibli va oldindan aytish mumkin bo'lgan kodga olib keladi, bu esa uni tushunish va o'zgartirishni osonlashtiradi.
• Kengaytiriluvchanlik: Loyihalash andozalari ilovangizni boshqarib bo'lmaydigan holatga kelmasdan o'sishi va rivojlanishiga imkon beradigan tarzda tuzishga yordam beradi.
• Muloqot: Loyihalash andozalaridan foydalanish dasturchilar uchun umumiy lug'atni taqdim etadi, bu esa loyihalash g'oyalarini yetkazish va samarali hamkorlik qilishni osonlashtiradi.

Singleton Andozasi

Singleton andozasi sinfning faqat bitta nusxaga ega bo'lishini ta'minlaydi va unga global kirish nuqtasini taqdim etadi. Bu ma'lum bir resurs yaratilishini nazorat qilish va butun ilovada faqat bitta nusxa ishlatilishini ta'minlash kerak bo'lganda foydalidir. Buni global konfiguratsiya obyekti yoki ma'lumotlar bazasiga ulanishlar puli (pool) kabi tasavvur qiling.

Implementatsiya

Bu yerda Singleton andozasining oddiy JavaScript implementatsiyasi keltirilgan:

            
let instance = null;

class Singleton {
  constructor() {
    if (!instance) {
      instance = this;
    }
    return instance;
  }

  static getInstance() {
    if (!instance) {
      instance = new Singleton();
    }
    return instance;
  }

  // O'z metodlaringiz va xususiyatlaringizni shu yerga qo'shing
  getData() {
    return "Singleton ma'lumotlari";
  }
}

// Foydalanish misoli
const singleton1 = Singleton.getInstance();
const singleton2 = Singleton.getInstance();

console.log(singleton1 === singleton2); // Natija: true
console.log(singleton1.getData()); // Natija: Singleton ma'lumotlari

            

              
                Copy
              
            
          

Tushuntirish:

• `instance` o'zgaruvchisi sinfning yagona nusxasini saqlaydi.
• `constructor` nusxa allaqachon mavjudligini tekshiradi. Agar mavjud bo'lsa, u mavjud nusxani qaytaradi; aks holda, yangisini yaratadi.
• `getInstance()` metodi nusxaga global kirish nuqtasini taqdim etadi.

Haqiqiy hayotdagi qo'llash holatlari

• Konfiguratsiyani Boshqarish: Singleton ilova miqyosidagi konfiguratsiya sozlamalarini saqlashi mumkin, bu esa turli modullar bo'ylab barqaror kirishni ta'minlaydi. Yagona, barqaror konfiguratsiya faylidan o'qishi kerak bo'lgan ilovani tasavvur qiling. Singleton fayl faqat bir marta o'qilishini va ilovaning barcha qismlari bir xil sozlamalardan foydalanishini ta'minlaydi.
• Loglash: Singleton loggeri barcha loglash faoliyatini markazlashtirishi mumkin, bu esa ilova xatti-harakatini kuzatish va tahlil qilishni osonlashtiradi. Bu bir vaqtning o'zida bir nechta logger nusxalarining bitta faylga yozishini oldini oladi, bu esa ma'lumotlarning buzilishiga olib kelishi mumkin.
• Ma'lumotlar bazasiga ulanishlar puli: Singleton ma'lumotlar bazasiga ulanishlar pulini boshqarishi, resurslardan foydalanishni optimallashtirishi va unumdorlikni oshirishi mumkin. Bu har bir ma'lumotlar bazasi bilan o'zaro aloqa uchun yangi ulanishlar yaratish xarajatlarini oldini oladi.

Afzalliklari

• Yagona nusxaga nazoratli kirish.
• Resurslarni optimallashtirish.
• Global kirish nuqtasi.

Kamchiliklari

• Global holat tufayli testlashni qiyinlashtirishi mumkin.
• Agar Singleton sinfi o'z nusxasini boshqarishdan ko'proq narsani qilsa, Yagona Mas'uliyat Prinsipini buzadi.

Observer Andozasi

Observer andozasi obyektlar o'rtasida "bir-ko'p"ga bog'liqlikni belgilaydi, shunda bir obyekt (subyekt) holati o'zgarganda, unga bog'liq bo'lgan barcha obyektlar (kuzatuvchilar) avtomatik ravishda xabardor qilinadi va yangilanadi. Bu bir-biriga qattiq bog'lanmagan tizimlarni yaratish uchun foydalidir, bunda obyektlar boshqa obyektlardagi o'zgarishlarga ular bilan chambarchas bog'lanmagan holda reaksiya ko'rsatishi mumkin. Aktsiya narxi o'zgarganda barcha ko'ruvchilarni yangilaydigan aktsiya tikerini o'ylab ko'ring.

Implementatsiya

Bu yerda Observer andozasining JavaScript implementatsiyasi keltirilgan:

            
class Subject {
  constructor() {
    this.observers = [];
  }

  subscribe(observer) {
    this.observers.push(observer);
  }

  unsubscribe(observer) {
    this.observers = this.observers.filter(obs => obs !== observer);
  }

  notify(data) {
    this.observers.forEach(observer => observer.update(data));
  }
}

class Observer {
  constructor(name) {
    this.name = name;
  }

  update(data) {
    console.log(`${this.name} yangilanish oldi: ${data}`);
  }
}

// Foydalanish misoli
const subject = new Subject();

const observer1 = new Observer("Kuzatuvchi 1");
const observer2 = new Observer("Kuzatuvchi 2");

subject.subscribe(observer1);
subject.subscribe(observer2);

subject.notify("Yangi ma'lumotlar mavjud!");

subject.unsubscribe(observer2);

subject.notify("Yana bir yangilanish!");

            

              
                Copy
              
            
          

Tushuntirish:

• `Subject` sinfi kuzatuvchilar ro'yxatini saqlaydi.
• `subscribe()` metodi kuzatuvchini ro'yxatga qo'shadi.
• `unsubscribe()` metodi kuzatuvchini ro'yxatdan o'chiradi.
• `notify()` metodi kuzatuvchilar ro'yxatidan o'tib, ularning `update()` metodini tegishli ma'lumotlar bilan chaqiradi.
• `Observer` sinfi `update()` metodini belgilaydi, u subyektning holati o'zgarganda chaqiriladi.

Haqiqiy hayotdagi qo'llash holatlari

• Hodisalarga ishlov berish: Observer andozasi hodisalarga ishlov berish tizimlarida, masalan, brauzer hodisalari (masalan, click, mouseover) va veb-ilovalardagi maxsus hodisalarda keng qo'llaniladi. Tugmani bosish (Subyekt) barcha ro'yxatdan o'tgan hodisa tinglovchilarini (Kuzatuvchilarni) xabardor qiladi.
• Real-vaqtda yangilanishlar: Chat ilovalari yoki aktsiya tikerlari kabi real vaqtda yangilanishlarni talab qiladigan ilovalarda Observer andozasi yangi ma'lumotlar mavjud bo'lganda mijozlarni xabardor qilish uchun ishlatilishi mumkin. Server (Subyekt) yangi xabar kelganda barcha ulangan mijozlarni (Kuzatuvchilarni) xabardor qiladi.
• Model-View-Controller (MVC): MVC arxitekturalarida Observer andozasi model o'zgarganda "view"larni xabardor qilish uchun ishlatiladi. Model (Subyekt) ma'lumotlar yangilanganda "View"ni (Kuzatuvchini) xabardor qiladi.

Afzalliklari

• Subyekt va kuzatuvchilar o'rtasidagi zaif bog'liqlik.
• Keng ko'lamli (broadcast) muloqotni qo'llab-quvvatlash.
• Obyektlar o'rtasidagi dinamik munosabat.

Kamchiliklari

• Agar ehtiyotkorlik bilan boshqarilmasa, kutilmagan yangilanishlarga olib kelishi mumkin.
• Yangilanishlar oqimini kuzatish qiyin.

Factory Andozasi

Factory andozasi superklassda obyektlarni yaratish uchun interfeysni taqdim etadi, lekin quyi sinflarga yaratiladigan obyektlar turini o'zgartirishga imkon beradi. Bu mijoz kodini yaratilayotgan aniq sinflardan ajratadi, bu esa mijoz kodini o'zgartirmasdan turli xil implementatsiyalar o'rtasida o'tishni osonlashtiradi. Foydalanuvchi kiritishiga asoslanib, turli xil transport vositalarini (avtomobillar, yuk mashinalari, mototsikllar) yaratish kerak bo'lgan stsenariyni ko'rib chiqing.

Implementatsiya

Bu yerda Factory andozasining JavaScript implementatsiyasi keltirilgan:

            
// Mavhum mahsulot
class Vehicle {
  constructor(model, year) {
    this.model = model;
    this.year = year;
  }

  getDescription() {
    return `Bu ${this.year}-yilda ishlab chiqarilgan ${this.model}.`;
  }
}

// Aniq mahsulotlar
class Car extends Vehicle {
  constructor(model, year) {
    super(model, year);
    this.type = "Avtomobil";
  }
}

class Truck extends Vehicle {
  constructor(model, year) {
    super(model, year);
    this.type = "Yuk mashinasi";
  }
  getDescription() {
      return `Bu ${this.year}-yilda ishlab chiqarilgan ${this.type} ${this.model}. U juda kuchli!`;
  }
}

class Motorcycle extends Vehicle {
  constructor(model, year) {
    super(model, year);
    this.type = "Mototsikl";
  }
}

// Fabrika
class VehicleFactory {
  createVehicle(type, model, year) {
    switch (type) {
      case "car":
        return new Car(model, year);
      case "truck":
        return new Truck(model, year);
      case "motorcycle":
        return new Motorcycle(model, year);
      default:
        return null;
    }
  }
}

// Foydalanish misoli
const factory = new VehicleFactory();

const car = factory.createVehicle("car", "Toyota Camry", 2023);
const truck = factory.createVehicle("truck", "Ford F-150", 2022);
const motorcycle = factory.createVehicle("motorcycle", "Honda CBR", 2024);

console.log(car.getDescription()); // Natija: Bu 2023-yilda ishlab chiqarilgan Toyota Camry.
console.log(truck.getDescription()); // Natija: Bu 2022-yilda ishlab chiqarilgan Yuk mashinasi Ford F-150. U juda kuchli!
console.log(motorcycle.getDescription()); // Natija: Bu 2024-yilda ishlab chiqarilgan Honda CBR.

            

              
                Copy
              
            
          

Tushuntirish:

• `Vehicle` sinfi barcha transport turlari uchun umumiy interfeysni belgilaydigan mavhum mahsulotdir.
• `Car`, `Truck` va `Motorcycle` sinflari `Vehicle` interfeysini implementatsiya qiluvchi aniq mahsulotlardir.
• `VehicleFactory` sinfi ko'rsatilgan turga asoslanib aniq mahsulotlarning nusxalarini yaratadigan fabrikadir.
• `createVehicle()` metodi tur, model va yilni argument sifatida qabul qiladi va tegishli transport vositasi sinfining nusxasini qaytaradi.

Haqiqiy hayotdagi qo'llash holatlari

• UI Freymvorklari: UI freymvorklari ko'pincha tugmalar, matn maydonlari va ochiladigan ro'yxatlar kabi turli xil UI elementlarini yaratish uchun Factory andozasidan foydalanadi. React, Vue va Angular komponent kutubxonalari ko'pincha komponentlarni yaratish uchun fabrika-ga o'xshash andozalarni qo'llaydi.
• O'yin ishlab chiqish: O'yin ishlab chiqishda Factory andozasi dushmanlar, qurollar va bonuslar kabi turli xil o'yin obyektlarini yaratish uchun ishlatilishi mumkin. Fabrika o'yin qiyinlik darajasiga qarab turli xil sun'iy intellekt raqiblarini yaratish uchun ishlatilishi mumkin.
• Ma'lumotlarga kirish qatlamlari: Factory andozasi ma'lumotlar bazasi ulanishlari va API mijozlari kabi turli xil ma'lumotlarga kirish obyektlarini yaratish uchun ishlatilishi mumkin. Fabrika turli xil ma'lumotlar bazasi tizimlariga (masalan, MySQL, PostgreSQL, MongoDB) ulanishlarni yaratish uchun ishlatilishi mumkin.

Afzalliklari

• Mijoz kodining aniq sinflardan ajratilishi.
• Kodning yaxshilangan tuzilishi va qo'llab-quvvatlanuvchanligi.
• Turli xil implementatsiyalar o'rtasida almashishning moslashuvchanligi.

Kamchiliklari

• Kod bazasiga murakkablik qo'shishi mumkin.
• Dastlabki sozlash ko'proq talab qilishi mumkin.

Xulosa

Singleton, Observer va Factory andozalari — bu JavaScript dasturchilari uchun mavjud bo'lgan ko'plab loyihalash andozalaridan faqat bir nechtasi. By tushunish va qo'llash orqali siz toza, yanada qo'llab-quvvatlanuvchan va kengaytiriluvchan kod yozishingiz mumkin. O'z loyihalaringizda ushbu andozalarni sinab ko'ring va dasturiy ta'minotni ishlab chiqish ko'nikmalaringizni yanada oshirish uchun boshqa loyihalash andozalarini o'rganing. Yodda tutingki, loyihalash andozalari oqilona ishlatilishi kerak bo'lgan vositalardir va har bir muammo loyihalash andozasi yechimini talab qilmaydi. To'g'ri vaziyat uchun to'g'ri andozani tanlang va har doim aniq, qisqa va tushunish oson bo'lgan kod yozishga intiling.

O'z ish jarayoningizga loyihalash andozalarini doimiy ravishda o'rganish va moslashtirish kodingiz sifatini va har qanday global loyihadagi murakkab dasturiy muammolarni hal qilish qobiliyatingizni sezilarli darajada oshiradi.